<!DOCTYPE html>
<html ng-app="mySuperApp">
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
        <title>宠物信息</title>
        <link rel="stylesheet" href="../ionic-v1.3.3/css/ionic.css" />
        <script type="text/javascript" src="../ionic-v1.3.3/js/ionic.bundle.min.js" ></script>
    	<script src="../js/jquery-2.1.1.min.js"></script>
    	<link href="../css/public.css" rel="stylesheet" />
    	<script src="../js/public.js"></script>
    </head>
    <style >
    	html{font-size: 20px}
        body{background-color: #F3F3F3}
        .row{background-color: #fff;}
        .right{text-align: right;color: #9D9D9D;}
        .right b{margin: 0 0.1rem;}
        .line{border:0;border-top: 1px solid #EEEEEE;}
        .col-name{line-height: 1.5rem}
        .right img{width: 1.5rem;height: 1.5rem;vertical-align: middle;} 
		.delete{position:fixed;bottom:35px;left:10%;background:#F3F3F3;border-radius:30px;border:1px solid #E94707;width:80%;height:50px;color:#E94707;} 
		.popup-body{background-color: #fff;text-align: center;color: #FF8B2E;padding: 1rem 0 2rem  0;font-size:0.7rem;}
		.popup-buttons{height:58px;min-height:58px;padding-bottom:0px;padding-left:40%;padding-right:28px;}
		.popup-buttons .button{background-color:#fff;color:#6B6B6B;}
		.popup-buttons .button+.button{color:#07E9A1;} 
		.mod .picture{margin-top:4.5%;margin-bottom:4.5%;}  
		.modal{
		    display: block;
		    position: absolute;
		    top: 75%;
		    z-index: 10;
		    overflow: hidden;
		    min-height: 100%;
		    width: 100%;
		    background-color: #fff;
		}
		.back{width:0.7rem;height:1.2rem;position:absolute;top:0.6rem;left:0.7rem;}
    </style>
    <body ng-controller="PopupCtrl">
		<ion-header-bar class="header" align-title="center"> 
			    <div class="back-padiv" onClick="back()">  
			      <img class="back" src="../img/back.png" />  
			    </div>  
			    <ion-title class="my-title head">宠物信息</ion-title> 
		</ion-header-bar>

     	<ion-content>
        	<div class="row" >
            	<div class="col col-name">头像</div>
            	<div class="col right">
                	<img src="../img/touxiang.png" ng-click="modal.show()"/><b></b> <i class="icon ion-chevron-right"></i>
            	</div>
        	</div>
        	<div class="row line"></div>
			
			<div class="row" ng-click="updateNickname()">
            	<div class="col col-name" >昵称</div>
            	<div class="col right col-name">
               		米米<b></b>  <i class="icon ion-chevron-right"></i>
            	</div>
        	</div>
        	<div class="row line"></div>
        	<div class="row" ng-click="updateVariety()">
            	<div class="col col-name" >品种</div>
            	<div class="col right col-name">
               		阿拉斯加<b></b>  <i class="icon ion-chevron-right"></i>
            	</div>
        	</div>
        	<div class="row line"></div>
        	
        	<div class="row" ng-click="updateNickname()">
            	<div class="col col-name" >性别</div>
            	<div class="col right col-name">
               		女生<b></b>  <i class="icon ion-chevron-right"></i>
            	</div>
        	</div>
        	<div class="row line"></div>

         	<div class="row">
            	<div class="col col-name">情场经历</div>
            	<div class="col right col-name">
               		老司机<b></b>  <i class="icon ion-chevron-right"></i>
            	</div>
        	</div>
        	<div class="row line"></div>
			
         	<div class="row" ng-click="updateWeight()">
            	<div class="col col-name">体重</div>
            	<div class="col right col-name">
               		21kg<b></b>  <i class="icon ion-chevron-right"></i>
            	</div>
        	</div>
        
     	</ion-content>
		<!--模态窗口-->
		<script id="templates/modal.html" type="text/ng-template">
        	<ion-modal-view class="mod">
	       		<div class="text-center picture">拍照</div>
	        	<div class="line"></div>
	        	<div class="text-center picture">从相册里选择</div>
	        	<div class="line"></div>
	        	<div class="text-center picture" ng-click="hideWindow()">取消</div>
        	</ion-modal-view>
		</script>
    	<button class="delete" ng-click="showConfirm()">删除宠物</button>
    	<script type="text/javascript" src="../js/pet-information.js" ></script>
  </body>
</html>
